<template>
	
	
	<!-- 标题 -->
		<view v-if="titleConfig" :style="'margin:0 '+prConfig*2+'rpx;'">
			<view @click="goLink" :url="linkConfig" class='title' :class="[(textPosition==0?'left':textPosition==2?'right':''),(textStyle==1?'italics':textStyle==2?'blod':''), (bgStyle===0?'':'borderRadius15')]" :style="'font-size:'+fontSize+'rpx;margin-top:'+mbConfig*2+'rpx;background-color:'+titleColor+';color:'+themeColor+';'">
				<!-- <view style="width: 100%;background-color: #fff;"> -->
					<!-- <view class="kefu_box">
						<view class="kefu_box_view">
							<image style="width: 80rpx; height: 68rpx;" src="https://aolaic.shangyunji.com/uploads/store/cen2.png" mode=""></image>
							<view>
								<h3>{{titleConfig}}</h3>
								<p>特价让你尖叫不停</p>
							</view>
						</view>
						<view class="kefu1_box">
							<image style="width: 130rpx;height: 25rpx;" src="https://aolaic.shangyunji.com/uploads/store/right_text1.png" mode=""></image>
						</view>
					</view> -->
				<view style="width: 100%;height: 90%;">
					<view class="kefu_box">
						<p @click="jieshao_Btn" style="width: 100%;font-size: 30rpx">{{titleConfig}}</p>
					</view>
					
					
					
				</view>
				<slot name="bottom"></slot>
			</view>
			
			<view class="content_box">
				
			
				<view class="image-bottom-box">
					<!-- <image  src="https://aolaic.shangyunji.com/uploads/store/index/yaoqing.png"></image> -->
					<view class="image-bottom-box">
					<image  @click="login_Btn" src="https://aolaic.shangyunji.com/uploads/store/index/fx.png"></image>
					</view> 
					<view class="image-bottom-box">
								<image src="https://aolaic.shangyunji.com/uploads/store/index/yaoqing.png"></image>
								<button style="opacity: 0;
					left: 10rpx;
					width: 345rpx;
					height: 133rpx;
					position: absolute;" open-type="share" @click="fxBtn1">分享</button>
					
							<!-- <button style="opacity: 0;
							left: 10rpx;
							width: 345rpx;
							height: 133rpx;
							position: absolute;" open-type="share" >分享
							</button> -->
					<!-- <image  @click="login_Btn" src="https://aolaic.shangyunji.com/uploads/store/index/reg.png"></image> -->
				</view> 
			
			</view>
		</view>
		
		
		
		
	</view>
</template>

<script>
	export default {
		name: 'titles',
		props: {
			dataConfig: {
				type: Object,
				default: () => {}
			},
			isSortType:{
				type: String | Number,
				default:0
			}
		},
		data() {
			return {
				fontSize:this.dataConfig.fontSize.val*2,
				linkConfig:this.dataConfig.linkConfig.value,
				mbConfig:this.dataConfig.mbConfig.val,
				textPosition:this.dataConfig.textPosition.type,
				textStyle:this.dataConfig.textStyle.type,
				titleColor:this.dataConfig.titleColor.color[0].item,
				titleConfig:this.dataConfig.titleConfig.value,
				themeColor:this.dataConfig.themeColor.color[0].item,
				prConfig:this.dataConfig.prConfig.val,
				bgStyle:this.dataConfig.bgStyle.type
			};
		},
		created() {},
		methods: {
			// 分享
			fxBtn1() {
				uni.share({
					provider: "weixin",
					scene: "WXSceneSession",
					type: 1,
					summary: "我正在使用奥莱轻奢美妆小程序~！赶紧跟我一起来体验~！",
					success: function(res) {
						console.log("success222:" + JSON.stringify(res));
					},
					fail: function(err) {
						console.log("fail111:" + JSON.stringify(err));
					}
				})
			},
			// 推广
			login_Btn(){
				console.log('1')
				uni.navigateTo({
					url: '/pages/users/user_spread_user/index'
				})
			},
			jieshao_Btn(){
				uni.navigateTo({
					url: '/pages/extension/news_details/index?id=1'
				})
			},
			goLink(){
				this.$util.JumpPath(this.linkConfig);
			}
		}
	}
</script>

<style lang="scss">
	.image-bottom-box {
		position:relative;
		background: #fff;
		width: 100%;
		height: 133rpx;
		padding-top: 15rpx;
		padding-bottom: 15rpx;
		display: flex;
		justify-content: space-around;
	
		image {
			width: 345rpx;
			height: 133rpx;
		}
	}
	.kefu_box{
		padding: 20rpx;
		display: flex;
		justify-content: space-between;
		align-items: center;
		.kefu_box_view{
			display: flex;
			align-items: center;
			image{
				width: 120rpx;
				height: 126rpx;
				margin-right: 20rpx;
			}
			h3{
				font-size: 28rpx;
				font-family: PingFang SC;
				font-weight: bold;
				color: #222222;
			}
			span{
				font-size: 22rpx;
				font-family: PingFang SC;
				font-weight: 400;
				color: #222222;
			}
			
		}
		.kefu1_box{
			image{
				width: 120rpx;
				height: 48rpx;
			}
		}
	}
	.title{
		font-size: 40rpx;
		color: #282828;
		text-align: center;
		width: 100%;
		//padding: 20rpx;
		box-sizing: border-box;
		
		&.left{
			text-align: left;
		}
		&.right{
			text-align: right;
		}
		&.blod{
			font-weight: bold;
		}
		&.italics{
			font-style: italic;
		}
	}
	
</style>
